<template>
  <div v-loading="delLoading">
    <div >
      <Search :search="search" :reset="reset" :inline="true">
        <template v-slot:body>
          <el-form-item label="暂收单单号" prop="ordernumber" maxlength="5">
            <el-input v-model="query.ordernumber" name="ordernumber" clearable />
          </el-form-item>
          <el-form-item label="采购订单号" prop="fbillno">
            <el-input v-model="query.fbillno" name="fbillno" clearable />
          </el-form-item>
          <!-- <el-form-item label="状态" prop="state">
            <el-select v-model="query.state" placeholder="请选择" clearable>
              <el-option label="待审核" value="0" />
              <el-option label="已审核" value="1" />
            </el-select>
          </el-form-item> -->
        </template>
      </Search>
      <div class="table-default">
        <!-- <Operate :show="open" /> -->
        <el-table :data="tableData" v-loading="loading" border>
          <el-table-column prop="ordernumber" label="暂收单号"  min-width="130"/>
          <el-table-column prop="fbillno" label="采购订单号" min-width="180" />
          <el-table-column prop="supplierOrder" label="供应商送货单" min-width="150"/>
          <el-table-column prop="remarks" label="备注"  min-width="150"/>
          <!-- <el-table-column prop="description" label="状态" width="130">
            <template #default="scope">
              <el-tag class="ml-2" type="warning" v-if="scope.row.description == '待审核'">{{ scope.row.description }}</el-tag>
              <el-tag class="ml-2" type="success" v-else>{{ scope.row.description }}</el-tag>
            </template>
          </el-table-column> -->
          <el-table-column prop="creator_id" label="创建人"  width="90"/>
          <el-table-column prop="created_at" label="创建时间"  width="150"/>
          <el-table-column label="操作" fixed="right" width="130">
            <template #default="scope">
              <div class="btnBox">
                <router-link :to="{ path: '/purchasing/provisionalreceiptDetail', query: { id: `${scope.row.id}` } }">
                  <show />
                </router-link>
                <!-- <el-button v-if="scope.row.state == 0" type="warning" size="small" @click="approveHandler(scope.row.id)"><Icon name="wrench-screwdriver" />审核</el-button> -->
                <Destroy @click="destroy(api, scope.row.id)" style="margin-left: 0" />
              </div>
            </template>
          </el-table-column>
        </el-table>
        <Paginate />
      </div>

      <Dialog v-model="visible" :title="title" destroy-on-close>
        <Create @close="close(reset)" :primary="id" :api="api" />
      </Dialog>
    </div>
  </div>
</template>

<script lang="ts" setup>
import { computed, onMounted, toRaw, ref, nextTick } from 'vue'
import { useRouter } from 'vue-router'

import { useGetList } from '/admin/composables/curd/useGetList'
import { useDestroy } from '/admin/composables/curd/useDestroy'
import { useOpen } from '/admin/composables/curd/useOpen'
import http from '/admin/support/http'
import { ElMessage } from 'element-plus'
import { setTableHeight } from '/admin/utils/setHeight.js'

let router = useRouter()

const api = 'purchasing/provisionalreceipt'

const sendId = ref(0)

const pageSize = ref(100)

const { data, query, search, reset, loading, toraw } = useGetList(api)
const { destroy, deleted ,delLoading} = useDestroy()
const { open, close, title, visible, id } = useOpen()

// const isDetail = ref(false)

const tableData = computed(() => data.value?.data)

console.log(tableData)

const formatFdocumentstatus = {
  0: '未审核',
  1: '审核',
}

const formatter = (row, column, value, index) => {
  return {
    0: '未审核',
    1: '审核',
  }[value]
}

const approveHandler = id => {
  http.post(`/purchasing/interfaceApi/${id}`).then(r => {
    let res = r.data.data
    // console.log('审批返回:', res)
    ElMessage.success(res)
    search()
  })
}

onMounted(() => {
  console.log('触发了onmounted')
  search()
  deleted(reset)
  setTableHeight('.table-default')
})
</script>


<style>
.table-default {
  padding: 20px;
}
.btnBox {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.el-table {
  height: 90%;
}
</style>

